
<template>
  <div >
      <div  >
        <h1>Hello Ztree(非异步)</h1>
        <div style='width:280px;' v-if='ztreeDataSource.length>0'>
           
           <zTree :list.sync='ztreeDataSource' :func='nodeClick' :is-open='false' :is-check='true'></zTree>
        </div>
      </div>
  </div>
</template>

<script>
import zTree from '~/components/common/tree/zTree.vue';
export default {
      components: {
    zTree,
  },
  data () {
    return {
      msg: 'Hello Vue-Ztree-2.0!',
      ztreeDataSource:[],
      dataList:[],
      treeDeepCopy:[],
      parentNodeModel:[],//当前点击节点父亲对象
      nodeModel:null, // 当前点击节点对象
     ts: this.newStore(),
      result:[],
      Promiseall:[],
    }
  },
  methods:{
          getTree(pid, rid) {
      const req = {
        handle: '67A5B6FEF17D97DECF116BDF95B95C0B639EC0CBABE57827',
        token: localStorage.getItem('token'),
        supid: pid,
        rid,
      };
      let ress=[];
      this.spost(this.ts, '/mainservlet', req).then((ts) => {
         
        if (ts.d.data.operation1[0].hash.funcid) {
          this.data = ts.d.data.operation1;
          for (const i of this.data) {
              let item={};
              item.id=i.hash.funcid;
              item.name=i.hash.funcname;
              item.parentId=pid;
            if (i.hash.rid.length > 0) {
              item.checked=true;
            }else{
                item.checked=false;
            } 
               item.children=[];
               ress.push(item);
              // console.log(ress);
               
              //this.getTree(item.id,rid,item.children);
            
          }
          return ress;
        }
        
      });
   
    },
          async    getTreea(pid, rid) {
              return new Promise((resolve,reject)=>{
      const req = {
        handle: '67A5B6FEF17D97DECF116BDF95B95C0B639EC0CBABE57827',
        token: localStorage.getItem('token'),
        supid: pid,
        rid,
      };
      let ress=[];
      let Promiset= this.spost(this.ts, '/mainservlet', req).then((ts) => {
         
        if (ts.d.data.operation1[0].hash.funcid) {
          this.data = ts.d.data.operation1;
          for (const i of this.data) {
              let item={};
              item.id=i.hash.funcid;
              item.name=i.hash.funcname;
              item.parentId=pid;
            if (i.hash.rid.length > 0) {
              item.checked=true;
            }else{
                item.checked=false;
            } 
               item.children=[];
               this.getTreea(item.id,rid).then((t)=>{
                  item.children=t;
               });
               ress.push(item);
              // console.log(ress);
               
              //this.getTree(item.id,rid,item.children);
            
          }
         
 resolve(ress);
        
         
        }
        
      });
      this.Promiseall.push(Promiset);
      
   });
    },
    // 点击节点
    nodeClick:function(trees){

       //this.treeDeepCopy = trees;
       //this.nodeModel = m;  // 当前点击节点对象
       //this.parentNodeModel = parent; //当前点击节点父亲对象
       //alert(1);
      // console.log(m);
      // console.log(parent);
    
       // 导航菜单
       this.dataList=[];
       this.getResult(trees);
      // this.findById(this.ztreeDataSource,m.parentId)
      // this.dataList= this.dataList.reverse();
      // this.dataList.push(m);
    },
    getResult:function(data) {

  
       for(var i = 0;i<data.length;i++){

            if (data[i].ckbool){
                this.dataList.push(data[i]);
            }
            if (data[i].hasOwnProperty('children')){

                this.getResult(data[i].children)

            }
        }
    },
  },
  components:{
    zTree
  },
  mounted (){
      //new Promise(()=>{
 //this.getTree('200000','ps61csar2gieij6z6hjt',this.result);
  //    }).then(()=>{
         // console.log(this.result);
          
    //  });
 //console.log(this.getTree('200000','ps61csar2gieij6z6hjt'));
 this.Promiseall=[];
 this.getTreea('200000','ps61csar2gieij6z6hjt').then((t)=>{
       console.log(t);
       
       Promise.all(this.Promiseall).then(()=>{
           this.ztreeDataSource=t;
       })
       
 });
      
//this.ztreeDataSource=[{"id":"200300","name":"系统功能","parentId":"200000","checked":false,"children":[]},{"id":"200450","name":"房产录入","parentId":"200000","checked":false,"children":[]},{"id":"200451","name":"导入数据","parentId":"200000","checked":false,"children":[]},{"id":"200550","name":"房产审核","parentId":"200000","checked":false,"children":[]},{"id":"200600","name":"信息查询","parentId":"200000","checked":false,"children":[]}];
 
  }
}
</script>
<style>
body {font-family: Helvetica, sans-serif;}
.iconClassRoot {
   width:15px;
   height:15px;
   display: inline-block;
   background: url("/images/ztree/root.png") no-repeat center/100% auto;
}
.iconClassNode {
   width:15px;
   height:15px;
   display: inline-block;
   background: url("/images/ztree/node.png") no-repeat center/100% auto;
}
.operate{
    display: flex;
}
.operate ul>li{

  float:left;
  margin:10px 10px;
  list-style-type: none;
}
</style>